<%@page import="com.chauncy.DMS.bean.ManagerInfoBean"%>

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
   <meta charset="UTF-8">
		<title>宿舍管理</title>
		<link rel="stylesheet" href="./layui/css/layui.css" />
		<script type="text/javascript" src="./layui/layui.js" ></script>
		<script type="text/javascript" src="./jquery-3.3.1/jquery-3.3.1.js" ></script>
		<script type="text/javascript" src="./jquery-3.3.1/jquery-3.3.1.min.js" ></script>
		
	</head>
	
	<body >
		<div class="layui-container">
				<div class="layui-row">
					<fieldset class="layui-elem-field layui-field-title">
						<legend>未住满的宿舍</legend>
					</fieldset>
					<div class="layui-form">
						<table class="layui-table" id="dormInfoTable">	
						</table>
					</div>
				</div>
				<div class="layui-row" style="min-height: 300px">
					<fieldset class="layui-elem-field layui-field-title">
						<legend>住宿信息查询</legend>
					</fieldset>
					<div class="layui-form" action="" method="post">
						<div class="layui-form-item">
							<label class="layui-form-label">请输入姓名</label>
							<div class="layui-input-inline">
								<input type="text" name="stuName"  id="stuName" lay-verify="stuName" autocomplete="off" placeholder="请输入学生姓名" class="layui-input"/>
							</div>
							<label class="layui-form-label">请输入学号</label>
							<div class="layui-input-inline">
								<input type="number" name="stuNub" id="stuNub" lay-verify="stuNub" autocomplete="off" placeholder="请输入学生学号"  class="layui-input" />
							</div>
							<div class="layui-input-inline">
								<button type="submit" name="submit" class="layui-btn" onclick="selectStuDormInfo()">查询</button>
							</div>
						</div>
					</div>
					<table class="layui-table layui-hide" id="stuDormInfoTable">
						<thead>
							<tr>
								<th>学生姓名</th>
								<th>所属学院</th>
								<th>专业/班级</th>
								<th>宿舍号</th>
							</tr>
						</thead>
						<tbody id="stuDormInfoTbody">
							
						</tbody>
					</table>
				</div>
				<div class="layui-row">
					<div id="container"></div>
				</div>
		</div>
		<%
			List<ManagerInfoBean> beans = (List)session.getAttribute("managerInfoList");
			String buildings = beans.get(0).getManager_buildings();
		 %>
		<script type="text/javascript">
			layui.use(['table','element'],function(){
				var table = layui.table,
				element = layui.element;
				table.render({
					elem:"#dormInfoTable",
					height: 460,
					url:'selectDormPeopleServlet',				
					cols: [[
				      	{field:'Dorm_number', title:'宿舍号', width:200, fixed: 'left'}
				      	,{field:'Checkin_number', title:'核入住/人', width:200}
				      	,{field:'Actual_people', title:'已入住/人', width:200,}
				      	,{field:'dormPeople', title:'可入住/人', width:200}
					    ]]
					   , page:true
					    ,response: {
				      		statusCode: 200 //重新规定成功的状态码为 200，table 组件默认为 0  
				    	}
					    ,parseData: function(res){ //将原始数据解析成 table 组件所规定的数据
					      return {
					        "code": res.status, //解析接口状态
					        "msg": res.message, //解析提示文本
					        "count": res.datasize, //解析数据长度
					        "data": res.rows.item //解析数据列表
					      };
					    }
				});
			});
			//获取管理员楼栋号
			var buildings  = '<%=buildings%>';
			//console.log(buildings);
			function getDormPerple(){
				$.ajax({
					type:"get",
					url:"selectDormPeopleServlet",
					async:true,
					data:{Buildings:buildings},
					dataType:"JSON",
					success : function(result){

						$.each(result,function(index,item){
							var tr ;
							
							tr = '<td>'+item.dorm_number+'</td>'+'<td>'+item.checkin_number+'</td>'+'<td>'+item.dorm_info_number+'</td>'+'<td>'+people+'</td>';
							$("#dormInfoTbody").append('<tr>'+tr+'</tr>');
							//console.log(item.dorm_number);
						})
					},
					error : function(xhr, status, errMsg){
						console.log("xhr"+xhr+"status:"+status+"errMsg:"+errMsg);
					}
				});
			}
			function selectStuDormInfo(){
				$.ajax({
					type:"get",
					url:"selectStuDormInfoByNameAndNumberServlet",
					async:true,
					data:{stuName:$("#stuName").val(),stuNub:$("#stuNub").val()},
					dataType:'JSON',
					success : function(result){
						console.log(result);
						$.each(result, function(index,item) {
							var tr;
							var jobClass = item.study_major + item.the_class;
							tr= '<td>'+item.stu_name+'</td>'+'<td>'+item.college+'</td>'+'<td>'+jobClass+'</td>' + '<td>'+item.dorm_number+'</td>';
							$("#stuDormInfoTable").removeClass("layui-hide");
							$("#stuDormInfoTbody").append('<tr>'+tr+'</tr>');
						});
					},
					error : function(xhr, status, errMsg){
						console.log("status:"+status+"errMsg:"+errMsg);
					}
				});
			}
		</script>
	</body>
</html>
